<template>
  <div>
    <!-- SSO系统入口提示文本 -->
    <p>SSO2: 点击下方按钮进入系统</p>

    <!-- 登录状态检查按钮 -->
    <button @click="checkLoginStatus">进入系统</button>

    <!-- 加载状态提示 -->
    <p v-if="checking" style="color:blue;">正在检查登录状态...</p>

    <!-- 错误提示信息-->
    <p v-if="error" style="color:red;">{{ error }}</p>
  </div>
</template>

<script>
export default {
  name: 'SSO', // 组件名称
  data() {
    return {
      checking: false, // 加载状态标识
      error: ''        // 错误信息存储
    }
  },
  methods: {
    /**
     * 检查登录状态
     * 1. 显示加载状态
     * 2. 异步请求
     * 3. 检查是否存在有效认证Cookie
     * 4. 根据检查结果进行路由跳转
     */
    checkLoginStatus() {
      this.checking = true;
      this.error = '';

      setTimeout(() => {
        // 调用Cookie读取方法
        const ssoid = this.getCookie("ssoid");

        if (ssoid) {
          // 认证成功跳转欢迎页
          this.$router.push('/welcome');
        } else {
          // 未认证跳转登录页并显示错误
          this.error = '未检测到有效登录状态';
          this.$router.push('/login');
        }

        this.checking = false;
      }, 500);
    },

    /**
     * 读取指定名称的Cookie值
     * @param {String} name - 要读取的Cookie名称
     * @returns {String} Cookie值，未找到时返回空字符串
     */
    getCookie(name) {
      const cookieArr = document.cookie.split(';');
      for (let cookie of cookieArr) {
        cookie = cookie.trim();
        if (cookie.startsWith(name + '=')) {
          return decodeURIComponent(cookie.substring(name.length + 1));
        }
      }
      return "";
    }
  }
}
</script>
